// 需求 参数设置为全局对象
let layer = layui.layer
let q = {
    pagenum: 1,
    pagesize: 4,
    cate_id: '',
    state: '',
}
// 展示页面到网页上
initArticleList()
function initArticleList() {
    axios({
        method: 'GET',
        url: '/my/article/list',
        params: q,
    }).then(function (res) {
        console.log(res.data);
        if (res.data.status !== 0) {
            return layer.msg(res.data.message)
        }
        // 成功渲染
        let arr = []
        res.data.data.forEach(ele => {
            arr.push(`
                <tr>
                        <td>${ele.title}</td>
                        <td>${ele.cate_name}</td>
                        <td>${formatDate(ele.pub_date)}</td>
                        <td>${ele.state}</td>
                        <td>

                            <button class="layui-btn layui-btn-xs">编辑</button>
                            <button data-id="${ele.Id}" class="del-btn layui-btn layui-btn-xs layui-btn-danger">删除</button>

                        </td>
                </tr>
            `)
        })

        let str = arr.join('')
        $('tbody').empty().html(str)
        renderPage(res.data.total)
    })
}

let form = layui.form
initArtCateList()
function initArtCateList() {
    axios({
        url: '/my/article/cates',
    }).then(function (res) {
        //console.log(res.data);
        if (res.data.status !== 0) {
            return layer.msg(res.data.message)
        }
        let arr = ['<option value="">请选择文章所属分类</option>']
        res.data.data.forEach(ele => {
            arr.push(`
        <option value="${ele.Id}">${ele.name}</option>
         `)
        })
        //console.log(arr);
        let str = arr.join('')
        //alert(str)
        $('[name=cate_id]').empty().html(str)
        form.render()
    })

}
// 筛选
$('#searchForm').on('submit', function (e) {
    // alert(1)
    e.preventDefault()
    q.cate_id = $('[name=cate_id]').val()
    q.state = $('[name=state]').val()
    initArticleList()
})
// 需求4
function renderPage(total) {
    var laypage = layui.laypage;
    //执行一个laypage实例
    laypage.render({
        elem: 'pageBox', //注意，这里的 test1 是 ID，不用加 # 号
        count: total, //数据总数，从服务端得到
        limit: q.pagesize,//每页显示多少条
        curr: q.pagenum, //第几页
        layout: ['count', 'limit', 'prev', 'page', 'next', 'skip',],
        limits: [2, 3, 5, 10, 20],
        jump: function (obj, first) {
            //obj包含了当前分页的所有参数，比如：
            //console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
            // console.log(obj.limit); //得到每页显示的条数

            //首次不执行
            if (!first) {
                //do something
                q.pagenum = obj.curr
                q.pagesize = obj.limit
                initArticleList()
            }
        }
    });
}
// 需求5

$('tbody').on('click', '.del-btn', function () {
    let id = $(this).attr('data-id')
    layer.confirm('确认删除吗？', { icon: 3, title: '提示' }, function (index) {
        //axios
        axios({
            url: '/my/article/delete/' + id,
        }).then(function (res) {
            if (res.data.status !== 0) {
                return layer.msg(res.data.message)
            }
            layer.msg('恭喜您，删除成功！')
        })
        $('.del-btn').length == 1 && q.pagenum >= 2 && q.pagenum--;

        initArticleList()

    });
    layer.close(index);
})
